<template>
  <div>
    <s-table
      ref="table"
      size="default"
      :rowKey="rowkey"
      :columns="columns"
      :data="loadData"
      :rowSelection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
    >
    </s-table>
    <Button>hello world</Button>
  </div>
</template>

<script>
import STable from '../../components/Table/index'
import { getDemoList } from '../../api/demo'
import { Button } from 'ant-design-vue';

export default {
  components: {
    STable,
    Button
  },
  data() {
    return {
      columns: [
        {
          title: '姓名',
          dataIndex: 'name'
        },
        {
          title: '年纪',
          dataIndex: 'age',
          sorter: true,
          needTotal: true,
          customRender: (text) => text + ' 岁'
        }
      ],
      // 查询条件参数
      queryParam: {},
      // 加载数据方法 必须为 Promise 对象
      loadData: parameter => {
        let params = Object.assign({
          user: '111'
        }, parameter)
        console.log('请求参数', params)
        return getDemoList(params).then(res => {
          console.log('table res', res)
          return res.result
        })
      },
      selectedRowKeys: [],
      selectedRows: []
    }
  },
  methods: {
    onSelectChange (selectedRowKeys, selectedRows) {
      this.selectedRowKeys = selectedRowKeys
      this.selectedRows = selectedRows
    },
    rowkey (record) {
      return record.id
    }
  }
}
</script>